<!DOCTYPE html>
<html lang="zh">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>融媒体内容生产方法与实践作业</title>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" />
  <script>
    var _hmt = _hmt || [];
    (function () {
      var hm = document.createElement("script");
      hm.src = "https://hm.baidu.com/hm.js?d54f110c773cfc933a9acea59426a0ff";
      var s = document.getElementsByTagName("script")[0];
      s.parentNode.insertBefore(hm, s);
    })();
  </script>

</head>
<style>
  body {
    background-image: url(resource/img/bg5_副本.jpg);
  }


  .container {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;


  }

  .title {
    text-align: center;
    margin: 100px 0;
    font-family: 'Courier New', Courier, monospace;
    font-weight: 2500;
    color: rgb(186, 183, 136);
    text-align: center;

    text-shadow: 3px 3px 5px rgb(22, 26, 3);
    ;
    line-height: 3;
    font-size: 50px;

  }

  .flex-box {
    display: flex;
    flex-wrap: wrap;


  }

  ul.flex-box {
    list-style: none;
    gap: 100px 100px;
  }

  ul.flex-box li {
    width: 40%;
    height: 150px;
    background-color: rgb(241, 241, 223);
    background: linear-gradient(rgba(232, 232, 111, 0.351), rgb(21, 75, 23));
    border-radius: 40px;
    position: relative;
    margin: 100px 0;
    padding: 20px;



    transform: scale(1);
    transition-property: all;
    transition-duration: 0.5;
    transition-timing-function: linear;
  }

  ul.flex-box li:hover {
    transform: scale(1.2);



  }

  ul.flex-box li a {
    text-decoration: none;
    font-size: 40px;
    width: 90%;
    text-align: center;
    line-height: 3;
    text-shadow: 3px 3px 5px black;
    ;
    color: rgb(206, 223, 203);
    border-radius: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

    .box-3 {
      transform: scale(1.5);
      transition-property: all;
      transition-duration: 0.5;
      transition-timing-function: linear;
    }

    .box-3:hover {
      transform: scale(1);




    }
</style>


<body>
  <div class="container">

    <h1 class="title animate__animated animate__slideInLeft">融媒体内容生产方法与实践</h1>

    <ul class="flex-box animate__animated animate__slideInUp">
      <li><a href="01-index.html">平时作业</a></li>

      <li><a href="期末作业.html">期末作业</a></li>


    </ul>


  </div>
</body>

</html>